<template>
	<view>
		<view style="width: 400rpx;margin-right: 50rpx;" class="u-flex" @click="bookItemClick(bookData.id)">
			<view>
				<image :src="$url+bookData.imageUrl" mode="aspectFill"
				style="width: 120rpx;height: 160rpx;"></image>
			</view>
			<view style="color: #d2a877;height: 100%;font-size: 30rpx;font-weight: bold;margin-bottom: auto;
			padding: 15rpx;">
				<text>{{index+1}}</text>
			</view>
			<view style="margin-left: 10rpx;font-size: 30rpx;margin-bottom: auto;">
				<view class="u-line-2" style="padding: 8rpx 0;">
					{{bookData.name}}
				</view>
			<view style="color: #808080;padding: 15rpx 0;font-size: 26rpx;"class="u-line-1">
					<text style="color: #d2a877;">{{bookData.types}}</text>·{{bookData.heat}}万热度</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:["bookData","index"],
		name:"book-item",
		data() {
			return {
				
			};
		},
		methods:{
			bookItemClick(e){
				this.$emit("bookItemClick",e)
			}
		}
	}
</script>

<style>

</style>
